<script setup lang="ts">
import VideoComp from '../components/video-comp.vue'
import { getImgSrc } from '@/views/product/reno14-pro/image/5/img-src'

const videoSrc = getImgSrc('videos-game-live_800.mp4')
</script>

<template>
  <div
    class="grid max-sm:gap-y-[1.75rem] sm:grid-cols-2 sm:grid-rows-1 sm:rounded-md sm:overflow-hidden lg:rounded-lg"
  >
    <div
      class="sm:col-start-2 sm:row-start-1 sm:p-[clamp(1rem,-1.607rem+6.4171vw,2.5rem)] sm:bg-white sm:grid sm:content-center lg:p-[clamp(2.5rem,-0.5rem+4.6875vw,4rem)]"
    >
      <div
        class="text-3xl sm:text-[clamp(1.5rem,0.8483rem+1.6043vw,1.875rem)] lg:text-[clamp(1.875rem,-0.375rem+3.5156vw,3rem)]"
      >
        <p>游戏实况记录</p>
        <p>高光时刻动起来</p>
      </div>

      <p
        class="text-base mt-[1.375rem] sm:mt-[1rem] lg:text-[clamp(1rem,0.75rem+0.3906vw,1.125rem)] lg:mt-[clamp(1rem,0rem+1.5625vw,1.5rem)]"
      >
        一键闪回 30
        秒，回录游戏精彩片段；还可一键保存实况照片，随心自由分享。无论是撞救的完美身法，还是扫式、抡式、点刺三连机关萧，每个高光镜头都不错过。
      </p>
    </div>

    <VideoComp class="sm:col-start-1 sm:row-start-1" :video-src />
  </div>
</template>
